<script>
  export let qqNum = '';
  export let nickName = '';
  export let content = '';
</script>

<main>
  <div class="bubble-wrapper">
    <div class="fake-news">
      <div class="flex-row">
        <img class="avatar" src={`https://q4.qlogo.cn/g?b=qq&nk=${qqNum}&s=140`} alt="avatar" />
        <div class="flex-col" style="margin-top: 50px;">
          <span class="nick-name">{nickName}</span>
          <div class="bubble-container">
            <i class="tail" />
            <div class="bubble">
              <span class="bubble-text">{content}</span>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</main>

<style lang="scss">
  @import '../assets/css/Bubble.scss';
  @import '../assets/css/MacOS.scss';
</style>
